<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小任务2</title>
    <link rel="stylesheet" href="小任务2.css">
</head>

<body style="padding-right: 0px;">
    <div id="root">
        <div class="head">
            <div class="header">
                <a class="header_logo" href="https://open.douyin.com/platform">
                    <img src="https://sf3-cdn-tos.douyinstatic.com/obj/ttfe/open/imgs/logo-text.png" alt="logo"></a>
                <div class="header_menu">
                    <a class="header_menu_shouye" href="#">首页</a>
                    <div class="fangan" style="cursor: pointer">
                        <a class="header_menu_fangan">
                            解决方案与案例
                            <span class="xia"></span>
                        </a>
                        <div class="semi_dropdown_fangan">
                            <div class="semi-dropdown-content">
                                <div class="dropdown_group" style="height: 298px;">
                                    <div class="header_menu_dropdown ">
                                        <div class="a_solution">
                                            <a class="header_menu_item" href="">解决方案</a>
                                            <div class="header_menu_dropdown solution">
                                                <a class="header_menu_item"
                                                    href="https://open.douyin.com/platform/solution/media">媒体行业</a>
                                                <a class="header_menu_item"
                                                    href="https://open.douyin.com/platform/solution/entertainment">娱乐行业</a>
                                                <a class="header_menu_item"
                                                    href="https://open.douyin.com/platform/solution/game">游戏行业</a>
                                                <a class="header_menu_item"
                                                    href="https://open.douyin.com/platform/solution/education">教育行业</a>
                                                <a class="header_menu_item"
                                                    href="https://open.douyin.com/platform/solution/ecommerce">电商行业</a>
                                                <a class="header_menu_item"
                                                    href="https://open.douyin.com/platform/solution/hardware">硬件行业</a>
                                                <a class="header_menu_item"
                                                    href="https://open.douyin.com/platform/solution/editor">编辑工具行业</a>
                                                <a class="header_menu_item"
                                                    href="https://open.douyin.com/platform/solution/domesticService">生活服务行业</a>
                                            </div>
                                        </div>
                                        <div class="a_example">
                                            <a class="header_menu_item" href="">优秀案例</a>
                                            <div class="header_menu_dropdown example">
                                                <a class="header_menu_item"
                                                    href="https://open.douyin.com/platform/example/developer">开发者案例</a>
                                                <a class="header_menu_item"
                                                    href="https://open.douyin.com/platform/example/serviceProvider">服务商案例</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <a class="header_menu_ziyuan" href="https://open.douyin.com/platform/doc">资源中心</a>
                    <div class="guanli" style="cursor: pointer">
                        <a class="header_menu_guanli">
                            管理中心
                            <span class="xia"></span>
                        </a>
                        <div class="semi_dropdown_guanli">
                            <div class="semi-dropdown-content">
                                <div class="header_menu_dropdown">
                                    <a class="header_menu_item"
                                        href="https://open.douyin.com/platform/management/app">应用管理</a>
                                    <a class="header_menu_item"
                                        href="https://open.douyin.com/platform/management/account">账号管理</a>
                                    <a class="header_menu_item"
                                        href="https://open.douyin.com/platform/management/service-market">服务管理</a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="kaifang" style="cursor: pointer">
                        <a class="header_menu_kaifang">
                            开放服务
                            <span class="xia"></span>
                        </a>
                        <div class="semi_dropdown_kaifang">
                            <div class="semi-dropdown-content">
                                <div class="header_menu_dropdown"><a class="header_menu_item"
                                        href="https://open.douyin.com/platform/data/index">数据开放服务</a>
                                    <a class="header_menu_item"
                                        href="https://open.douyin.com/platform/data/live_sdk">抖音直播SDK</a>
                                    <a href="https://ailab.tobsnssdk.com/" rel="noopener noreferrer" target="_blank"
                                        class="header_menu_item">特效开放服务</a>
                                    <a href="https://microapp.bytedance.com/" rel="noopener noreferrer" target="_blank"
                                        class="header_menu_item">小程序开放平台</a>
                                    <a href="https://op.jinritemai.com/home" rel="noopener noreferrer" target="_blank"
                                        class="header_menu_item">抖店开放平台</a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <a class="header_menu_fuwu"
                        href="https://open.douyin.com/platform/micro-app/market-list/home/recommend">服务市场</a>
                </div>
                <div class="search"></div>
                <div class="user">
                    <span class="touxiang"></span>
                    <a href="https://developer.open-douyin.com/login?service=https%3A%2F%2Fopen.douyin.com%2Fplatform"
                        class="user_action">登录</a>
                    <a href="https://developer.open-douyin.com/login?service=https%3A%2F%2Fopen.douyin.com%2Fplatform"
                        class="user_middle">|</a>
                    <a href="https://developer.open-douyin.com/login?service=https%3A%2F%2Fopen.douyin.com%2Fplatform"
                        class="user_action">注册</a>

                </div>
            </div>
        </div>
        <div class="container">
            <div class="banner">
                <div class="shipin">
                    <video
                        src="https://sf3-cdn-tos.douyinstatic.com/obj/douyin-open-static/tiktok.open/home/1622457228545-1598239826729-more.mp4"
                        autoplay="autoplay" muted="muted" loop="loop"></video>
                </div>
                <div class="box_text">
                    <div class="text">
                        <h2>解锁更多功能</h2>
                        <h3>成为合作伙伴，即刻体验行业解决方案</h3>
                        <div class="text_choices">
                            <a href="https://open.douyin.com/platform/micro-app/market-list/home/recommend"
                                class="liaojie">了解更多</a>
                            <a href="https://open.douyin.com/platform/doc" class="jishu">技术文档</a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="module">
                <h2>资源优势</h2>
                <div class="resource">
                    <div class="box show1">
                        <li>
                            <div>
                                <div class="img"
                                    style="background-image: url(https://sf3-cdn-tos.douyinstatic.com/obj/douyin-open-static/tiktok.open/home/seq1.png);  ">
                                </div><span>多端功能开放</span>
                                <p>提供移动/网站/小程序开发能力，无需多次对接</p>
                            </div>
                        </li>
                    </div>
                    <div class="box show2">
                        <li>
                            <div>
                                <div class="img"
                                    style="background-image: url(https://sf3-cdn-tos.douyinstatic.com/obj/douyin-open-static/tiktok.open/home/seq2.png);">
                                </div><span>业务能力开放</span>
                                <p>帐号免登、内容同步、数据回流、用户管理等</p>
                            </div>
                        </li>
                    </div>
                    <div class="box show3">
                        <li>
                            <div>
                                <div class="img"
                                    style="background-image: url(https://sf3-cdn-tos.douyinstatic.com/obj/douyin-open-static/tiktok.open/home/seq3.png);">
                                </div><span>丰富的解决方案</span>
                                <p>为广大内容创作者和服务商提供行业解决方案</p>
                            </div>
                        </li>
                    </div>
                    <div class="box show4">
                        <li>
                            <div>
                                <div class="img"
                                    style="background-image: url(https://sf3-cdn-tos.douyinstatic.com/obj/douyin-open-static/tiktok.open/home/seq4.png);">
                                </div><span>完善的服务支持</span>
                                <p>完善的对接服务，提供沙盒测试环境和应用监控</p>
                            </div>
                        </li>
                    </div>
                </div>
                <a href="https://open.douyin.com/platform/doc">
                    <div class="liaojie">了解更多</div>
                </a>
            </div>
        </div>
        <div class="float_aid">
            <div class="help_box">
                <div class="float_aid_item help_center">
                    <span class="help_center_text">
                        帮助中心
                    </span>
                </div>
                <div class="semi_dropdown_help">
                    <div class="semi-dropdown-content">
                        <ul class="semi_dropdown_menu" style="display: block;">
                            <li class="semi_dropdown_item">
                                <span class="help"></span>
                                <div class="label">常见问题</div>
                                <div class="convenience">快捷</div>
                            </li>
                            <li class="semi_dropdown_item">
                                <div style="display: flex; flex-direction: row; align-items: center;">
                                    <span class="hear"></span>
                                    <div class="label">联系客服</div>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="fake"></div>
            <div class="qr_box">
                <div class="float_aid_item qr">
                    <div class="qr_img">
                    </div>
                    <div class="qr_img_text">
                        <span class="q_r_text">
                            公众号二维码
                        </span>
                    </div>
                </div>
                <div class="semi_dropdown_qr">
                    <div class="semi-dropdown-content">
                        <div class="qr_img_wrap"><img
                                src="https://sf3-cdn-tos.douyinstatic.com/obj/ttfe/open/imgs/qrcode.png" alt="抖音公众号二维码">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>

</html>